<header class="page-header">
  <div class="page-actions">
    <span class="note">{{key}}</span>

    <a class="coding-rules-detail-permalink icon-link spacer-left" target="_blank" href="{{permalink}}"
       data-toggle="tooltip" data-placement="left" title="Rule permalink"></a>

    <a class="js-rule-filter link-no-underline spacer-left" href="#">
      <i class="icon-filter icon-half-transparent"></i>&nbsp;<i class="icon-dropdown"></i>
    </a>
  </div>
  <h3 class="page-title coding-rules-detail-header">
    <big>{{name}}</big>
  </h3>
</header>

<ul class="coding-rules-detail-properties">
  <li class="coding-rules-detail-property"
      data-toggle="tooltip" data-placement="bottom" title="{{t 'coding_rules.type.tooltip' this.type}}">
    {{issueTypeIcon this.type}} {{issueType this.type}}
  </li>

  <li class="coding-rules-detail-property"
      data-toggle="tooltip" data-placement="bottom" title="Default rule severity">
    {{severityIcon severity}}&nbsp;{{t "severity" severity}}
  </li>

  {{#notEq status 'READY'}}
    <li class="coding-rules-detail-property"
        data-toggle="tooltip" data-placement="bottom" title="Rule status">
      <span class="badge badge-normal-size badge-danger-light">
        {{t 'rules.status' status}}
      </span>
    </li>
  {{/notEq}}

  <li class="coding-rules-detail-property coding-rules-detail-tag-list {{#if canCustomizeRule}}coding-rules-detail-tags-change{{/if}}"
      data-toggle="tooltip" data-placement="bottom" title="Rule tags">
    <i class="icon-tags"></i>
    <span>{{#if allTags}}{{join allTags ', '}}{{else}}{{t 'coding_rules.no_tags'}}{{/if}}</span>
    {{#if canCustomizeRule}}<i class="icon-dropdown"></i>{{/if}}
  </li>

  {{#if canCustomizeRule}}
    <li class="coding-rules-detail-property coding-rules-detail-tag-edit hidden">
      {{#if sysTags}}<i class="icon-tags"></i>
        <span>{{join sysTags ', '}}</span>{{/if}}
      <input class="coding-rules-detail-tag-input" type="text" value="{{#if tags}}{{join tags ','}}{{/if}}">

      <div class="button-group">
        <button class="coding-rules-detail-tag-edit-done">{{t 'Done'}}</button>
      </div>
      <a class="coding-rules-details-tag-edit-cancel">{{t 'cancel'}}</a>
    </li>
  {{/if}}

  <li class="coding-rules-detail-property">{{t 'coding_rules.available_since'}} {{d createdAt}}</li>

  <li class="coding-rules-detail-property"
      data-toggle="tooltip" data-placement="bottom" title="Rule repository (language)">
    {{repoName}} ({{langName}})
  </li>

  {{#if isTemplate}}
    <li class="coding-rules-detail-property"
        title="{{t 'coding_rules.rule_template.title'}}">{{t 'coding_rules.rule_template'}}</li>
  {{/if}}

  {{#if templateKey}}
    <li class="coding-rules-detail-property"
        title="{{t 'coding_rules.custom_rule.title'}}">{{t 'coding_rules.custom_rule'}}
      (<a href="#rule_key={{templateKey}}">{{t 'coding_rules.show_template'}}</a>)
    </li>
  {{/if}}

  {{#if debtRemFnType}}
    <li class="coding-rules-detail-property"
        data-toggle="tooltip" data-placement="bottom" title="{{t 'coding_rules.remediation_function'}}">
      {{t 'coding_rules.remediation_function' debtRemFnType}}:

      {{#if debtRemFnOffset}}{{debtRemFnOffset}}{{/if}}
      {{#if debtRemFnCoeff}}{{#if debtRemFnOffset}}+{{/if}}{{debtRemFnCoeff}}{{/if}}
      {{#if effortToFixDescription}}{{effortToFixDescription}}{{/if}}
    </li>
  {{/if}}
</ul>
